<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>函数调用模式</title>
</head>
<body>
  <script>
    /*
        根据函数调用方式不同，this的指向也不同
          1.以函数形式调用，this指向window
          2.以方法形式调用，this指向调用方法的对象
          3.在构造函数中，this是新建的对象
          4.箭头函数中没有自己的this,由外层作用域决定，外层作用域的this指向谁，他的this就指向谁
          5.通过call和apply调用的函数，它们的第一个参数，就是this
          6.通过bind返回的函数，this永远指向bind的第一个参数，并且无法修改
    */

    function fn() {
      console.log('this--->', this)
    }
    const obj = {name: '孙悟空', age: 18}

    /*
      调用函数除了通过函数名()这种形式外，还可以通过fn函数对象伤的方法来调用
       - call()
          通过call方法调用函数，函数的参数直接在第一个参数后，一个一个的列出来
       - apply()
          通过apply方法调用函数，函数的实参需要通过数组进行传递
    */
    fn.call() // window
    fn.call(obj) // this---> obj

    function fn2 (a, b) {
      console.log('a =', a, 'b =', b)
    }
    fn2.call(obj, 1, 2)
    fn2.apply(obj, [1,2])
  </script>
</body>
</html>